<!DOCTYPE html>
<html>
<head>
	<title>测试绘画svg</title>
	<script type="text/javascript" src="http://cdn.jsdelivr.net/vivus/0.2.1/vivus.min.js"></script>
</head>
<body>
<!-- 开始 -->

<svg id="testsvg" version="1.0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="595.28px" height="841.89px" viewBox="0 0 595.28 841.89" enable-background="new 0 0 595.28 841.89" xml:space="preserve">

	<g>
		<path fill="#FDFFFF" d="M408.947,309.698c34.752,24.326,144.483,93.778,86.877,149.429c-27.069,26.15-48.301-0.718-63.069,0.15
			l-162-78.667l2.666-96"/>
		<g>
			<path d="M407.73,311.401c28.4,19.85,57.833,39.352,80.5,65.952c10.814,12.691,20.755,28.069,21.524,45.206
				c0.86,19.146-14.412,40.789-33.19,45.304c-10.125,2.435-19.932-2.283-28.908-6.371c-3.35-1.524-6.737-3.016-10.336-3.841
				c-0.641-0.146-4.652-0.71-3.355-0.081c-0.137-0.065-0.272-0.132-0.409-0.198c-6.224-3.021-12.446-6.044-18.67-9.065
				c-27.302-13.258-54.603-26.516-81.904-39.773c-20.337-9.875-40.674-19.751-61.011-29.626c0.417,0.628,0.833,1.257,1.25,1.886
				c0.889-32,1.777-64,2.666-96c0.072-2.629-4.852-3.227-4.932-0.365c-0.889,32-1.777,64-2.666,96
				c-0.021,0.754,0.594,1.567,1.25,1.886c44.822,21.766,89.645,43.531,134.467,65.298c8.256,4.008,16.51,8.017,24.766,12.025
				c2.007,0.975,3.286,1.661,5.589,1.738c8.053,0.272,16.151,6.298,23.63,8.92c20.861,7.314,39.817-5.151,50.412-23
				c8.111-13.663,7.641-29.519,1.777-43.903c-9.25-22.694-28.586-40.893-46.959-56.357c-16.833-14.17-35.048-26.452-53.057-39.039
				C407.709,306.279,405.085,309.552,407.73,311.401L407.73,311.401z"/>
		</g>
	</g>
	<g>
		<path fill="#FDFFFF" d="M262.088,310.61"/>
		<g>
			<path d="M262.143,312.702c3.236,0,2.882-4.184-0.109-4.184C258.797,308.519,259.151,312.702,262.143,312.702L262.143,312.702z"/>
		</g>
	</g>
	<g>
		<path fill="#E7DCF9" d="M506.4,407.377c6.695,16.808,4.635,33.493-11.375,50.012c-8.938,9.222-16.271,13.889-33.222,8.783
			C506.088,445.944,506.4,407.377,506.4,407.377z"/>
	</g>
	<g>
		<path fill="#FDFFFF" d="M401.129,568.592c-3.475,46.913-56.471,108.596-106.859,83.402c0,0-33.514-78.716-30.848-87.383"/>
		<g>
			<path d="M398.687,568.06c-1.799,21.802-12.328,42.395-26.358,58.866c-14.143,16.603-34.75,30.636-57.393,29.567 c-5.551-0.262-10.92-1.696-16.055-3.761c-2.5-1.004-2.045-0.181-3.004-2.453c-1.963-4.654-3.896-9.32-5.813-13.994 c-6.218-15.159-12.285-30.399-17.725-45.858c-1.835-5.214-3.587-10.466-5.049-15.799c-0.76-2.769-2.18-6.578-1.427-9.484 c0.407-1.568-4.463-2.692-4.885-1.064c-0.91,3.509,0.911,8.161,1.841,11.478c1.981,7.066,4.471,13.998,6.982,20.89 c5.449,14.956,11.402,29.73,17.484,44.438c1.457,3.524,2.925,7.044,4.414,10.555c0.806,1.902,3.647,2.469,5.399,3.221 c4.761,2.045,9.836,3.242,14.948,3.976c20.202,2.895,39.689-6.638,54.545-19.601c19.797-17.275,34.799-43.497,36.978-69.911 C403.715,567.387,398.813,566.531,398.687,568.06L398.687,568.06z"/>
		</g>
	</g>
	<g>
		<path fill="#E2E2E2" d="M290.093,580.09c2.266,30.838,7.355,71.09,7.355,71.09l4.662,3.713c5.956-5.13,10.823-12.128,13.979-21.144
			c4.345-12.163,2.809-34.105-0.667-47.138L290.093,580.09z"/>
	</g>
	<g>
		<path fill="#FDFFFF" d="M163.954,551.216c10.427,38.227,26.063,79.928,59.946,103.384c28.669,19.112,66.026,13.9,78.188-20.851
			c4.345-12.163,2.809-34.105-0.667-47.138"/>
		<g>
			<path d="M162.5,550.538c6.428,23.446,14.313,46.562,26.727,67.579c11.545,19.548,28.424,38.349,50.232,46.245
				c18.085,6.547,38.664,3.933,52.616-9.847c16.37-16.169,15.977-41.271,11.94-62.287c-0.318-1.66-0.719-3.303-1.14-4.939
				c-0.415-1.611-3.717-4.5-2.908-1.355c5.289,20.567,5.844,44.617-8.169,61.859c-12.251,15.074-33.018,18.26-50.863,12.98
				c-21.68-6.412-38.069-24.926-49.557-43.552c-12.334-19.998-19.795-42.799-25.971-65.328
				C164.971,550.3,161.643,547.412,162.5,550.538L162.5,550.538z"/>
		</g>
	</g>
	<g>
		<path fill="#E2E2E2" d="M233.9,644.6c-29.902-20.7-45.59-55.609-56.031-89.801l-13.916-3.583
			c10.427,38.227,26.063,79.928,59.946,103.384c24.415,16.276,55.119,14.896,71.209-7.33
			C278.155,659.412,253.915,657.942,233.9,644.6z"/>
	</g>
	<g>
		<path fill="#FDFFFF" d="M413.291,525.153c2.606,39.095-6.949,53.863-59.944,61.683c0,0-64.289,2.606-101.646-3.476
			c-88.614-12.163-154.642-70.369-125.971-165.065c26.063-84.271,92.958-140.741,174.622-164.198"/>
		<g>
			<path d="M410.791,525.153c0.946,14.808,1.231,31.752-10.338,42.771c-5.964,5.681-14.097,8.764-21.838,11.107
				c-8.235,2.493-17.619,5.026-26.238,5.34c-38.129,1.388-77.232,1.547-114.779-5.919c-39.707-7.895-79.973-27.318-101.587-62.987
				c-24.038-39.667-14.52-87.589,4.049-127.341c30.83-66.002,91.9-111.604,160.956-131.617c3.092-0.896,1.775-5.722-1.328-4.822
				c-44.578,12.92-86.032,35.938-118.743,69.082c-16.244,16.459-29.937,35.401-40.729,55.837
				c-10.953,20.741-19.539,43.632-22.561,66.974c-2.613,20.186-0.881,40.702,6.725,59.681c6.951,17.345,18.638,32.327,32.874,44.311
				c32.225,27.126,74.97,37.514,116.079,40.749c20.024,1.576,40.172,1.741,60.247,1.492c12.654-0.158,24.079-0.774,36.531-3.451
				c14.18-3.049,29.413-7.976,38.418-20.079c8.54-11.479,8.128-27.587,7.263-41.127C415.586,521.952,410.585,521.932,410.791,525.153
				L410.791,525.153z"/>
		</g>
	</g>
	<g>
		<path fill="#E2E2E2" d="M379.347,577.836c0,0-64.289,2.606-101.646-3.476c-88.614-12.163-154.642-70.369-125.971-165.065
			c23.007-74.391,77.838-127.113,146.555-154.59c-80.724,23.812-146.713,80.032-172.555,163.59
			C97.059,512.991,163.086,571.197,251.7,583.36c37.357,6.082,101.646,3.476,101.646,3.476c18.825-2.777,32.164-6.434,41.429-11.744
			C390.095,576.098,384.968,577.007,379.347,577.836z"/>
	</g>
	<g>
		<path fill="#FDFFFF" d="M322.272,308.163c34.362,13.834,96.504,26.263,94.837-31.471c-1.093-44.259-60.802-69.283-96.559-52.644
			c-24.098,10.266-31.87,29.079-18.546,51.311"/>
		<g>
			<path d="M322.173,308.41c14.383,5.749,29.434,10.154,44.871,11.801c14.391,1.536,30.924,0.365,41.923-10.141
				c12.791-12.218,12.908-34.842,6.646-50.169c-6.804-16.649-22.295-28.012-38.399-34.774c-17.265-7.25-37.103-10.012-55.063-3.637
				c-10.646,3.779-21.174,10.348-26.346,20.718c-5.301,10.628-1.678,22.672,3.938,32.316c0.643,1.104,4.293,1.271,4.525,1.67
				c-5.564-9.559-8.537-20.445-4.287-31.088c4.115-10.303,14.266-16.223,23.853-20.56c19.063-8.621,43.418-5.175,61.064,5.086
				c17.295,10.056,29.504,27.126,29.921,47.466c0.343,16.776-6.236,32.377-22.632,38.604c-10.772,4.091-23.099,3.577-34.308,1.989
				c-12.16-1.724-24.118-5.224-35.507-9.775C319.733,306.861,319.533,307.355,322.173,308.41L322.173,308.41z"/>
		</g>
	</g>
	<g>
		<g>
			<path fill="#E2E2E2" d="M417.109,276.692c-1.093-44.259-60.802-69.283-96.559-52.644c-24.041,10.241-31.829,28.99-18.637,51.153
				c-9.674-18.839-2.299-35.052,18.619-44.635c33.304-16.599,90.255,5.492,92.405,47.208c1.966,35.249-22.072,43.399-48.154,41.46
				C392.41,322.069,418.191,314.151,417.109,276.692z"/>
		</g>
	</g>
	<g>
		<path d="M328.332,278.051c-8.862,3.682-16.638-6.631-8.553-12.799c9.742-6.687,14.46,5.491,9.381,12.54"/>
	</g>
	<g>
		<path d="M379.591,299.346c-8.861,3.681-16.636-6.631-8.553-12.8c9.743-6.687,14.46,5.492,9.382,12.54"/>
	</g>
	<g>
		<g>
			<path d="M324.348,274.203c14.479,9.024,29.679,17.688,46.685,20.699c3.381,0.599,1.155-1.541-0.816-1.891
				c-15.358-2.719-29.082-10.742-42.151-18.887C327.177,273.571,322.311,272.934,324.348,274.203L324.348,274.203z"/>
		</g>
	</g>
	<g>
		<g>
			<circle fill="#E86B0F" cx="382.088" cy="391.944" r="52.667"/>
			<g>
				<path d="M432.302,391.463c-0.313,24.017-16.604,45.16-40.254,50.479c-24.493,5.508-48.821-9.421-57.24-32.526
					c-8.232-22.596,1.318-47.988,21.175-60.871c21.309-13.825,49.807-8.117,65.399,11.381
					C428.503,368.832,432.153,380.127,432.302,391.463c0.028,2.142,4.932,2.897,4.906,0.963
					c-0.276-21.146-12.439-40.707-31.874-49.513c-19.725-8.937-42.978-6.012-59.591,7.959c-16.83,14.153-22.751,37.77-15.822,58.408
					c6.741,20.079,25.571,34.084,46.318,36.532c31.904,3.766,60.55-21.325,60.969-53.387
					C437.236,390.286,432.327,389.505,432.302,391.463z"/>
			</g>
		</g>
		<g>
			<g>
				<path d="M334.068,378.212c13.001,0.942,20.432,14.567,24.13,25.454c3.679,10.827,5.062,22.693,4.729,34.096
					c-0.014,0.473,4.977,0.699,4.986,0.365c0.673-23.062-5.435-58.394-33.807-60.45C331.273,377.471,331.233,378.007,334.068,378.212
					L334.068,378.212z"/>
			</g>
		</g>
		<g>
			<g>
				<path d="M397.791,341.843c0.149,23.653,8.028,49.888,31.273,60.234c2.678,1.191,3.391-0.407,0.713-1.6
					c-21.167-9.422-27.26-36.085-27.393-57.098C402.377,342.104,397.783,340.498,397.791,341.843L397.791,341.843z"/>
			</g>
		</g>
		<g>
			<g>
				<path d="M336.563,416.856c33.928,0.42,82.821-20.331,82.673-60.178c-0.011-3.006-4.974-2.991-4.963-0.135
					c0.138,37.156-45.736,56.214-77.327,55.822C333.873,412.328,333.318,416.816,336.563,416.856L336.563,416.856z"/>
			</g>
		</g>
		<g>
			<g>
				<path d="M350.59,351.697c16.551,5.581,24.555,23.354,29.865,38.643c5.574,16.041,8.269,32.813,12.636,49.177
					c0.287,1.077,5.009-0.505,4.66-1.811c-4.475-16.767-7.321-33.884-13.032-50.322c-5.228-15.045-13.595-32.393-29.799-37.858
					C353.535,349.059,349.887,351.459,350.59,351.697L350.59,351.697z"/>
			</g>
		</g>
	</g>
	<path fill="#E7DCF9" d="M228.755,375.944c-15.334-7.334-67.334,17.333-61.334,60s47.334,44,68.667,32.666"/>
	<g>
		<path fill="#FDFFFF" d="M302.959,324.467c6.949,33.014,14.768,59.946,49.52,70.371c33.881,9.556,78.188,13.9,91.221,52.994
			c16.506,48.652-34.752,87.746-78.19,93.828c-52.994,6.949-105.12-23.457-127.709-72.107
			c-18.243-39.964-13.031-81.665-3.476-122.497"/>
		<g>
			<path d="M300.549,325.132c4.191,19.824,9.03,40.791,23.422,55.933c14.808,15.577,36.933,18.362,56.709,23.562
				c20.114,5.288,41.57,12.638,53.986,30.452c13.379,19.196,12.062,43.853-0.439,62.947c-12.307,18.797-33.453,31.529-54.579,37.965
				c-23.025,7.015-48.152,4.801-70.543-3.421c-23.383-8.587-43.753-24.86-58.102-45.114c-17.238-24.333-23.642-53.831-22.765-83.289
				c0.568-19.063,4.191-37.919,8.496-56.445c0.729-3.138-4.091-4.47-4.82-1.33c-6.628,28.519-11.134,57.676-7.203,86.929
				c3.56,26.484,15.33,51.122,33.354,70.77c31.307,34.131,82.07,50.27,126.63,35.542c39.386-13.017,76.839-50.982,60.49-95.047
				c-7.203-19.415-24.024-31.141-42.656-38.361c-9.835-3.812-20.122-6.383-30.344-8.915c-10.666-2.643-21.611-4.795-31.436-9.899
				c-23.776-12.354-30.277-39.479-35.38-63.606C304.703,320.648,299.883,321.986,300.549,325.132L300.549,325.132z"/>
		</g>
	</g>
	<g>
		<path fill="#E2E2E2" d="M305.664,337.164c9.226,32.213,18.711,58.287,51.289,65.339c31.708,6.271,72.46,6.352,87.761,44.037
			c2.284,5.547,3.683,11.05,4.325,16.461c1.159-9.783-0.034-20.051-4.325-30.468c-15.301-37.685-56.053-37.767-87.761-44.037
			c-32.578-7.052-42.063-33.126-51.289-65.339V337.164z"/>
	</g>
	<path fill="#E7DCF9" d="M227.755,405.61c0,0,61.313,1.193,81.333,25.334c22.667,27.333,7.667,73-29,70.333
		C280.088,501.277,233.755,507.277,227.755,405.61z"/>
	<g>
		<path fill="#FDFFFF" d="M405.772,313.701c-6.851-4.567-23.599-8.374-23.599,4.567c0,9.135,15.985,15.224,22.837,19.03"/>
		<g>
			<path d="M405.842,312.021c-6.486-4.129-23.855-9.312-25.363,2.867c-1.657,13.373,15.662,19.318,24.938,24.358
				c2.438,1.324,0.574-3.143-0.811-3.895c-6.808-3.698-22.468-8.473-20.275-18.471c2.011-9.166,16.263-4.751,21.373-1.499
				C408.466,317.141,407.431,313.031,405.842,312.021L405.842,312.021z"/>
		</g>
	</g>
	<g>
		<path fill="#FDFFFF" d="M419.772,327.035c-7.818-5.212-26.932-9.557-26.932,5.213c0,10.425,18.243,17.374,26.063,21.718"/>
		<g>
			<path d="M419.842,325.354c-8.139-5.198-26.017-10.1-28.702,3.396c-2.874,14.438,18.683,22.003,28.169,27.163
				c2.438,1.325,0.573-3.142-0.811-3.895c-8.065-4.387-26.804-10.194-23.242-22.256c2.896-9.807,18.728-4.7,24.447-1.047
				C422.463,330.479,421.428,326.367,419.842,325.354L419.842,325.354z"/>
		</g>
	</g>
	<g>
		<path fill="#FDFFFF" d="M434.931,347.156c-7.818-5.212-26.932-9.557-26.932,5.213c0,10.425,18.243,17.374,26.063,21.718"/>
		<g>
			<path d="M435,345.476c-8.139-5.198-26.017-10.1-28.702,3.396c-2.874,14.438,18.683,22.003,28.169,27.163
				c2.438,1.325,0.573-3.142-0.811-3.895c-8.065-4.387-26.804-10.194-23.242-22.256c2.896-9.807,18.728-4.7,24.447-1.047
				C437.621,350.6,436.586,346.488,435,345.476L435,345.476z"/>
		</g>
	</g>
	<g>
		<path fill="#E2E2E2" d="M370.509,512.66c-52.994,6.949-105.12-23.457-127.709-72.107c-12.57-27.537-14.003-55.899-10.554-84.233
			c-8.127,37.856-11.312,76.287,5.554,113.233c22.589,48.65,74.715,79.057,127.709,72.107c39.439-5.522,85.32-38.259,81.081-80.653
			C433.867,488.731,400.344,508.482,370.509,512.66z"/>
	</g>
	<g>
		<path fill="#E2E2E2" d="M408.947,309.698h-10c34.752,24.326,144.483,93.778,86.877,149.429
			c-7.033,6.795-13.672,10.005-19.906,11.057c8.988,1.417,18.971-0.492,29.906-11.057
			C553.431,403.477,443.699,334.024,408.947,309.698z"/>
	</g>
</svg>

<svg id="testsvg2" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="1000px" height="800px" viewBox="0 0 1000 800" enable-background="new 0 0 1000 800" xml:space="preserve">
	<g id="Layer_1_1_">
    <defs>
        <path id="textline" fill="none" d="M474.432,344.553c7.165-5.251,16.004-8.351,25.568-8.351c9.294,0,17.905,2.928,24.958,7.913"/>
    </defs>
	<g>
		<polygon fill="#FFFFFF" points="358,707.5 358,686.086 418,626.086 418,303.5 580,303.5 580,626.086 640,686.086 640,707.5 		"/>
		<path fill="#60544F" d="M579,304.5v322l60,60v20H359v-20l60-60v-322H579 M581,302.5h-2H419h-2v2v321.172l-59.414,59.414
			L357,685.672v0.828v20v2h2h280h2v-2v-20v-0.828l-0.586-0.586L581,625.672V304.5V302.5L581,302.5z"/>
	</g>
	
		<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="142.5" y1="660.5" x2="142.5" y2="57.5" gradientTransform="matrix(1 0 0 1 -42 206)">
		<stop  offset="0" style="stop-color:#E1DAD5"/>
		<stop  offset="0.3204" style="stop-color:#FFFFFF"/>
	</linearGradient>
	<rect x="-378" y="263.5" display="none" fill="url(#SVGID_1_)" width="957" height="603"/>
	<ellipse display="none" fill="#E6E6E6" cx="129" cy="446.5" rx="70" ry="20"/>
	<path display="none" fill="#999999" d="M79.503,460.642L129,446.5l49.497,14.142C191.165,457.023,199,452.023,199,446.5
		c0-11.046-31.34-20-70-20s-70,8.954-70,20C59,452.023,66.835,457.023,79.503,460.642z"/>
	<ellipse display="none" fill="#999999" cx="129" cy="626.586" rx="50" ry="14.286"/>
	<ellipse display="none" fill="#B3B3B3" cx="129" cy="618.3" rx="50.75" ry="14.5"/>
	<path display="none" opacity="0.1" fill="#FF0000" enable-background="new    " d="M93.645,636.687L129,626.586l35.355,10.102
		c9.048-2.585,14.645-6.157,14.645-10.102c0-7.89-22.386-14.286-50-14.286s-50,6.396-50,14.286
		C79,630.531,84.596,634.102,93.645,636.687z"/>
	<rect x="419" y="304.5" fill="#CCC1BC" stroke="#60544F" stroke-miterlimit="10" width="160" height="325.15"/>
	<polygon fill="#F4EEE6" stroke="#60544F" stroke-miterlimit="10" points="639,686.5 359,686.5 419,626.5 579,626.5 	"/>
	<rect x="359" y="686.5" fill="#E0D8D3" stroke="#60544F" stroke-miterlimit="10" width="280" height="20"/>
	<rect x="802.2" y="524.5" fill="none" width="112.8" height="101.6"/>
	<ellipse id="top" fill="none" stroke="#60544F" stroke-width="2" stroke-miterlimit="10" cx="499" cy="486.5" rx="70" ry="22"/>
	<g id="tap">
		<g>
			<path fill="#FFFFFF" d="M499,479.5c-4.086,0-11-0.812-11-3.857v-5.389l-25.762-21.468h73.523L510,470.254v5.389
				C510,478.688,503.086,479.5,499,479.5z"/>
			<path fill="#60544F" d="M533,449.786l-24,20v5.857c0,1.578-4.477,2.857-10,2.857s-10-1.279-10-2.857v-5.857l-24-20H533
				 M538.524,447.786H533h-68h-5.524l4.244,3.536l23.28,19.4v4.92c0,4.623,9.996,4.857,12,4.857s12-0.234,12-4.857v-4.92l23.28-19.4
				L538.524,447.786L538.524,447.786z"/>
		</g>
		<path fill="#FFFFFF" stroke="#60544F" stroke-width="2" stroke-miterlimit="10" d="M489,469.643v6c0,1.578,4.477,2.857,10,2.857
			s10-1.279,10-2.857v-6H489z"/>
		<path fill="#FFFFFF" stroke="#60544F" stroke-miterlimit="10" d="M533,449.786h-68l24,20h0.025
			c0.262,1.511,4.621,2.714,9.975,2.714s9.712-1.203,9.975-2.714H509L533,449.786z"/>
	</g>
	<g>
		<polygon fill="#FFFFFF" points="396.871,459.75 358,449.521 358,288.336 418.586,227.75 579.414,227.75 640,288.336 640,449.531 
			599.123,459.75 		"/>
		<path fill="#60544F" d="M579,228.75l60,60v160l-40,10H397l-38-10v-160l60-60H579 M579.828,226.75H579H419h-0.828l-0.586,0.586
			l-60,60L357,287.922v0.828v160v1.542l1.491,0.392l38,10l0.25,0.066H397h202h0.246l0.239-0.06l40-10l1.515-0.379v-1.562v-160
			v-0.828l-0.586-0.586l-60-60L579.828,226.75L579.828,226.75z"/>
	</g>
	<rect x="397" y="298.75" fill="#E0D8D3" stroke="#60544F" stroke-miterlimit="10" width="202" height="160"/>
	<polygon fill="#E0D8D3" stroke="#60544F" stroke-miterlimit="10" points="639,448.75 599,458.75 599,298.75 639,288.75 	"/>
	<polygon fill="#E0D8D3" stroke="#60544F" stroke-miterlimit="10" points="359,448.75 397,458.75 397,298.75 359,288.75 	"/>
	<polygon fill="#F4EEE6" stroke="#60544F" stroke-miterlimit="10" points="579,228.75 419,228.75 359,288.75 397,298.75 599,298.75 
		639,288.75 	"/>
	<path fill="#FFFFFF" stroke="#60544F" stroke-width="3" stroke-miterlimit="10" d="M569,436.5c0,6.627-5.373,12-12,12H443
		c-6.627,0-12-5.373-12-12v-114c0-6.627,5.373-12,12-12h114c6.627,0,12,5.373,12,12V436.5z"/>
	<g>
		<path fill="#FFFFFF" d="M500,440c-33.359,0-60.5-27.14-60.5-60.5S466.641,319,500,319s60.5,27.14,60.5,60.5S533.359,440,500,440z"
			/>
		<path fill="#60544F" d="M500,319.5c33.084,0,60,26.916,60,60s-26.916,60-60,60s-60-26.916-60-60S466.916,319.5,500,319.5
			 M500,318.5c-33.689,0-61,27.311-61,61s27.311,61,61,61s61-27.311,61-61S533.689,318.5,500,318.5L500,318.5z"/>
	</g>
	<polyline id="arrow" fill="#60544F" points="496.83,348.346 500,339.894 503.17,348.346 	"/>
    <g>
        <path fill="none" stroke="#60544F" d="M500,379.5v61" id="separator"/>
        <use xlink:href="#separator" transform="rotate(72, 500, 379.5)"/>
        <use xlink:href="#separator" transform="rotate(144, 500, 379.5)"/>
        <use xlink:href="#separator" transform="rotate(216, 500, 379.5)"/>
        <use xlink:href="#separator" transform="rotate(288, 500, 379.5)"/>
    </g>
    <text fill="#423733" style="font: 400 11px Source Sans Pro, source-sans-pro, sans-serif" text-anchor="middle">
        <textPath xlink:href="#textline" startOffset="50%">Americano</textPath>
    </text>
    <text transform="rotate(72, 500, 379.5)" fill="#423733" style="font: 400 11px Source Sans Pro, source-sans-pro, sans-serif" text-anchor="middle">
        <textPath xlink:href="#textline" startOffset="50%">Latté</textPath>
    </text>
    <text transform="rotate(144, 500, 379.5)" fill="#423733" style="font: 400 11px Source Sans Pro, source-sans-pro, sans-serif" text-anchor="middle">
        <textPath xlink:href="#textline" startOffset="50%">Mocha</textPath>
    </text>
    <text transform="rotate(216, 500, 379.5)" fill="#423733" style="font: 400 11px Source Sans Pro, source-sans-pro, sans-serif" text-anchor="middle">
        <textPath xlink:href="#textline" startOffset="50%">Mochiatto</textPath>
    </text>
    <text transform="rotate(288, 500, 379.5)" fill="#423733" style="font: 400 11px Source Sans Pro, source-sans-pro, sans-serif" text-anchor="middle">
        <textPath xlink:href="#textline" startOffset="50%">Espresso</textPath>
    </text>
	<radialGradient id="SVGID_12_" cx="542" cy="174.72" r="35.99" gradientTransform="matrix(1 0 0 1 -42 206)" gradientUnits="userSpaceOnUse">
		<stop  offset="0.8139" style="stop-color:#60544F"/>
		<stop  offset="1" style="stop-color:#60544F;stop-opacity:0"/>
	</radialGradient>
	<circle opacity="0.5" fill="url(#SVGID_12_)" cx="500" cy="380.72" r="35.99"/>
    <g opacity="0">
        <path id="mocha-area" d="M500,379.5v61A61,61,0,0,0,558.01,398.35z"/>
        <path id="mochiatto-area" d="M500,379.5v61A61,61,0,0,0,558.01,398.35z" transform="rotate(72, 500, 379.5)"/>
        <path id="espresso-area" d="M500,379.5v61A61,61,0,0,0,558.01,398.35z" transform="rotate(144, 500, 379.5)"/>
        <path id="americano-area" d="M500,379.5v61A61,61,0,0,0,558.01,398.35z" transform="rotate(216, 500, 379.5)"/>
        <path id="latte-area" d="M500,379.5v61A61,61,0,0,0,558.01,398.35z" transform="rotate(288, 500, 379.5)"/>
    </g>
	<circle fill="#fff" stroke="#60544F" cx="500" cy="379.5" r="33"/>
	<circle id="dot" fill="none" stroke="#60544F" stroke-miterlimit="10" cx="500" cy="355.71" r="3.66"/>
	<circle id="knob" fill="none" cx="500" cy="379.5" r="33"/>
    <circle fill="#FFFFFF" stroke="#60544F" stroke-miterlimit="10" cx="439" cy="318.5" r="2"/>
    <circle fill="#FFFFFF" stroke="#60544F" stroke-miterlimit="10" cx="561" cy="318.5" r="2"/>
    <circle fill="#FFFFFF" stroke="#60544F" stroke-miterlimit="10" cx="561" cy="440.5" r="2"/>
    <circle fill="#FFFFFF" stroke="#60544F" stroke-miterlimit="10" cx="439" cy="440.5" r="2"/>
	<g id="pie-chart">
		<circle fill="#D6EDEE" cx="735" cy="560" r="35"/>
		<path fill="#60544F" d="M746.089,527.343c-4.258-1.827-8.947-2.843-13.874-2.843v35.215L746.089,527.343z"/>
		<path fill="#60544F" d="M732.215,524.5c19.449,0,35.215,15.766,35.215,35.215s-15.766,35.215-35.215,35.215
			c-19.449,0-35.215-15.766-35.215-35.215S712.766,524.5,732.215,524.5 M732.215,523.5c-19.969,0-36.215,16.246-36.215,36.215
			s16.246,36.215,36.215,36.215s36.215-16.246,36.215-36.215S752.185,523.5,732.215,523.5L732.215,523.5z"/>
	</g>
	<g id="legend">
		<rect x="785.5" y="524.5" fill="#60544F" stroke="#60544F" width="10" height="10"/>
		<rect x="785.5" y="544.5" fill="#D6EDEE" stroke="#60544F" stroke-miterlimit="10" width="10" height="10"/>
		<text transform="matrix(1 0 0 1 802.2 533.1641)" fill="#60544F" style="font: 400 12px Source Sans Pro, source-sans-pro, sans-serif">Espresso (10%)</text>
		<text transform="matrix(1 0 0 1 802.2 553.1641)" fill="#60544F" style="font: 400 12px Source Sans Pro, source-sans-pro, sans-serif">Hot Water (90%)</text>
		<text transform="matrix(1 0 0 1 695.0001 628.8398)" fill="#60544F" style="font: 300 20px Source Sans Pro, source-sans-pro, sans-serif">Americano</text>
	</g>
	<path fill="none" stroke="#60544F" stroke-width="3" stroke-miterlimit="10" d="M917,634.5c0,6.627-5.373,12-12,12H691
		c-6.627,0-12-5.373-12-12v-124c0-6.627,5.373-12,12-12h214c6.627,0,12,5.373,12,12V634.5z"/>
	<path id="lead-target" fill="#CCC1BC" stroke="#60544F" stroke-width="3" stroke-miterlimit="10" d="M597.429,278.5L559,228.5H438
		l-37.429,50H597.429z"/>
	<line fill="none" stroke="#60544F" stroke-miterlimit="10" x1="439" y1="228.5" x2="439" y2="278.5"/>
	<line fill="none" stroke="#60544F" stroke-miterlimit="10" x1="559.571" y1="228.5" x2="559.571" y2="278.5"/>
	<polygon fill="#D6EDEE" stroke="#60544F" stroke-miterlimit="10" points="499,277.5 584.886,277.5 559.143,243.5 499,243.5 	"/>
	<g>
		<g>
			<defs>
				<polygon id="SVGID_13_" points="498.886,277.259 413,277.259 438.743,243.259 498.886,243.259 				"/>
			</defs>
			<clipPath id="SVGID_14_">
				<use xlink:href="#SVGID_13_"  overflow="visible"/>
			</clipPath>
			<g clip-path="url(#SVGID_14_)">
				<ellipse fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="450.912" cy="258.311" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.8735 -0.4868 0.4868 -0.8735 669.7087 712.0128)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="427.358" cy="268.999" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.4709 -0.8822 0.8822 -0.4709 489.8846 819.3075)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="490.638" cy="262.746" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.4709 -0.8822 0.8822 -0.4709 415.2328 788.3985)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="444.043" cy="269.678" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.4709 -0.8822 0.8822 -0.4709 479.6064 818.7933)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="485.345" cy="265.571" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.4709 -0.8822 0.8822 -0.4709 436.6833 787.9611)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="454.637" cy="263.027" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.8824 -0.4706 0.4706 -0.8824 749.885 720.0967)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="464.952" cy="266.315" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.8824 -0.4706 0.4706 -0.8824 754.0936 731.8059)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="468.52" cy="271.644" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.8824 -0.4706 0.4706 -0.8824 770.1696 739.825)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="477.561" cy="273.644" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.8824 -0.4706 0.4706 -0.8824 756.9172 704.5107)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="466.52" cy="257.643" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.8824 -0.4706 0.4706 -0.8824 741.4103 713.2869)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="459.864" cy="263.969" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.8824 -0.4706 0.4706 -0.8824 690.028 713.6212)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="434.214" cy="270.559" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.8824 -0.4706 0.4706 -0.8824 771.2519 699.3343)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="473.041" cy="253.263" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.8824 -0.4706 0.4706 -0.8824 701.4598 726.6494)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="441.559" cy="275.644" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.8824 -0.4706 0.4706 -0.8824 774.2177 747.3199)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="480.521" cy="276.885" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 293.138 751.4692)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="462.938" cy="252.323" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 294.4048 750.2875)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="463.074" cy="251.199" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.5855 0.8107 -0.8107 -0.5855 916.987 29.4758)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="450.958" cy="249.172" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 260.2598 733.8298)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="439.073" cy="257.345" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 298.3394 773.8927)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="474.979" cy="261.345" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 232.4501 752.6062)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="433.073" cy="278.442" rx="4" ry="6"/>
				<ellipse fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="439" cy="269.259" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 224.9438 737.9938)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="423.168" cy="274.295" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 266.965 773.3755)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="459.074" cy="274.295" rx="4" ry="6"/>
				<ellipse fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="437" cy="263.259" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 278.1527 750.7935)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="455.161" cy="258.294" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 264.3377 757.2653)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="450.978" cy="267.346" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 322.381 773.8436)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="486.979" cy="251.199" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 279.8261 791.0107)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="472.929" cy="277.698" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 309.7851 779.53)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="483.075" cy="259.345" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 302.1902 807.3271)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="490.98" cy="276.441" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 320.78 780.4955)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="488.979" cy="255.199" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 302.28 783.6927)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="481.075" cy="264.586" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 259.0287 744.7932)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="443.073" cy="263.345" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 311.1602 768.3956)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="479.075" cy="253.199" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 309.6638 803.4297)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="493.076" cy="271.346" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 271.6239 739.1082)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="446.977" cy="255.2" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 296.0231 796.5965)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="483.379" cy="273.672" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 290.8345 778.0555)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="472.979" cy="266.586" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 275.6698 777.2891)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="465.074" cy="272.587" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 292.7961 785.2273)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="476.979" cy="269.346" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 254.2292 764.8404)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="449.113" cy="275.39" rx="4" ry="6"/>
				
					<ellipse transform="matrix(-0.1703 -0.9854 0.9854 -0.1703 267.9093 762.7525)" fill="#7F6C65" stroke="#60544F" stroke-miterlimit="10" cx="455.074" cy="268.586" rx="4" ry="6"/>
			</g>
		</g>
	</g>
	<polygon fill="#CCC1BC" stroke="#60544F" stroke-miterlimit="10" points="503,277.5 501.297,235.5 495.846,235.5 495,277.5 	"/>
	<path id="lead" fill="#E0D8D3" stroke="#60544F" stroke-width="3" stroke-miterlimit="10" d="M569,132.5l-10,96H438l-9-96H569z"/>
	
		<ellipse id="waterlevel" display="none" fill="none" stroke="#60544F" stroke-width="2" stroke-miterlimit="10" cx="499" cy="526.5" rx="66.5" ry="20.9"/>
	
		<ellipse id="bottom" display="none" fill="none" stroke="#60544F" stroke-width="2" stroke-miterlimit="10" cx="499" cy="666.5" rx="50.909" ry="16"/>
</g>
</svg>






<!-- 结束 -->
<script type="text/javascript">
	new Vivus('testsvg', {type: 'delayed', duration: 200}, function(){});	
	new Vivus('testsvg2', {type: 'delayed', duration: 200}, function(){});	
</script>
</body>
</html>